/**
 * HighlightText - 用于在文本中高亮显示指定搜索词的React Native组件
 * @author BelovedLYC
 * @component
 * @param {string} text - 需要显示的原始文本（默认空字符串）
 * @param {string} searchText - 要高亮显示的搜索词（必需）
 * @param {StyleProp<TextStyle>} [style] - 基础文本样式
 * @param {StyleProp<TextStyle>} [highlightStyle] - 高亮部分的额外样式
 * @returns 带有高亮效果的Text组件
 *
 * @example
 * // 基本用法
 * <HighlightText
 *   text="Hello World! Welcome to the React Native world."
 *   searchText="world"
 *   style={{ fontSize: 16 }}
 *   highlightStyle={{ color: 'red' }}
 * />
 *
 * @example
 * // 空搜索词时显示普通文本
 * <HighlightText
 *   text="This is normal text"
 *   searchText=""
 * />
 *
 * @example
 * // 自定义高亮样式
 * <HighlightText
 *   text="Custom highlight style example"
 *   searchText="highlight"
 *   style={{ fontFamily: 'Arial' }}
 *   highlightStyle={{
 *     backgroundColor: 'yellow',
 *     fontWeight: 'bold'
 *   }}
 * />
 *
 * @description
 * 1. 自动处理空值和非法正则表达式
 * 2. 支持大小写不敏感匹配
 * 3. 默认添加浅黄色背景高亮(#FDFF8C)
 * 4. 自动转义正则特殊字符
 * 5. 单行显示，超出部分显示省略号
 */
import React from "react";
import { Text } from "react-native";
import { HighlightTextProps } from "./types/index";
import { useTheme } from "@/contexts/ThemeContext";

const HighlightText: React.FC<HighlightTextProps> = ({
  text = "", // 处理空值
  searchText,
  style,
  highlightStyle,
}) => {
  const { colors } = useTheme();
  const safeText = String(text);
  const trimmedSearch = searchText?.trim() || "";
  if (!trimmedSearch || trimmedSearch.length === 0) {
    return <Text style={style}>{safeText}</Text>;
  }

  try {
    const escapedSearch = escapeRegExp(trimmedSearch);
    const regex = new RegExp(`(${escapedSearch})`, "gi");
    const parts = safeText.split(regex);

    return (
      <Text style={style} numberOfLines={1} ellipsizeMode="tail">
        {parts.filter(Boolean).map((part, index) => {
          return regex.test(part) ? (
            <Text
              key={`highlight-${index}`}
              style={[
                style,
                highlightStyle,
                { backgroundColor: colors.primary, color: colors.text.white },
              ]}
            >
              {part}
            </Text>
          ) : (
            part
          );
        })}
      </Text>
    );
  } catch (error) {
    return <Text style={style}>{safeText}</Text>;
  }
};

const escapeRegExp = (string: string) => {
  return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
};

export default HighlightText;
